<!--
公用列表标记显示

-->
<template>
  <div>
    <el-tag class="tag-item" size="mini" v-if="labels.length>0" v-for="(item,index) in labels" :color="item.color" :key="index">{{item.name}}</el-tag>
  </div>
</template>

<script>
  export default {
    name: 'CompTags',
    data () {
      return {

      }
    },
    props: ['label'],
    computed:{
      labels:function () {
        if(!this.label) {
            return [];
        }
        let _arr = [];
        let _labelArr = [];
        if(this.label.indexOf(',') >=0) {
          _arr = this.label.split(',');
        } else  {
          _arr = [this.label];
        }
        _arr.forEach(item =>{
          _labelArr.push({
            name:item.split('|')[1],
            color:item.split('|')[0],
          })
        })
        return _labelArr;
      }
    }
  }
</script>

<style scoped lang="scss">
  .tag-item {
    margin-right: 5px;
  }
</style>
